<!--
    -  Copyright (c) 2018-2025, haohanwork.com All rights reserved.
  -->
<template>
    <div class="execution">
        <basic-container>
            <template>
                <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
                    <div class="blank">
                        <div class="title"><h3><span class="title-text">|</span> 基本信息</h3></div>
                    </div>
                    <el-form-item label="供应商名称" size="small" required prop="supplierName">
                        <el-input v-model="ruleForm.supplierName" class="input"></el-input>
                    </el-form-item>
                    <el-form-item label="供应商简称" size="small">
                        <el-input v-model="ruleForm.shortName" class="input"></el-input>
                    </el-form-item>
                    <el-form-item label="商家名称" size="small">
                        <!--<el-input v-model="ruleForm.merchantName" class="input"></el-input>-->
                    </el-form-item>
                    <el-form-item label="联系人" size="small" required>
                        <el-input v-model="ruleForm.contact" class="input"></el-input>
                    </el-form-item>
                    <el-form-item label="电话" size="small" required prop="telephone">
                        <el-input v-model="ruleForm.telephone" class="input"></el-input>
                    </el-form-item>
                    <el-form-item label="详细地址" size="small">
                        <el-input v-model="ruleForm.address" class="input"></el-input>
                    </el-form-item>
                    <el-form-item label="经度" size="small">
                        <el-input v-model="ruleForm.longitude" class="input"></el-input>
                    </el-form-item>
                    <el-form-item label="纬度" size="small">
                        <el-input v-model="ruleForm.latitude" class="input"></el-input>
                    </el-form-item>
                    <el-form-item label="部门" size="small" required>
                        <avue-crud-input v-model="ruleForm.area"
                                         type="tree"
                                         placeholder="请选择所属部门"
                                         :dic="treeDeptData"
                                         :props="defaultProps"></avue-crud-input>
                    </el-form-item>
                    <div class="blank">
                        <div class="title"><h3><span class="title-text">|</span> 财务信息</h3></div>
                    </div>
                    <el-form-item label="供应商类型">
                        <el-radio-group v-model="ruleForm.supplierType">
                            <el-radio
                                    v-for="item in supplierTypeDict"
                                    :key="item.value"
                                    :label="item.value">{{item.label}}
                            </el-radio>
                        </el-radio-group>
                    </el-form-item>
                    <el-form-item label="启用状态">
                        <el-radio-group v-model="ruleForm.status">
                            <el-radio
                                    v-for="item in useStatusDict"
                                    :key="item.value"
                                    :label="item.value">{{item.label}}
                            </el-radio>
                        </el-radio-group>
                    </el-form-item>
                    <el-form-item label="启用状态">
                        <el-radio-group v-model="ruleForm.needPush">
                            <el-radio :label="'1'">是</el-radio>
                            <el-radio :label="'0'">否</el-radio>
                        </el-radio-group>
                    </el-form-item>
                    <el-form-item label="账期">
                        <el-radio-group v-model="ruleForm.payPeriod">
                            <el-radio
                                    v-for="item in payPeriodDict"
                                    :key="item.value"
                                    :label="item.value">{{item.label}}
                            </el-radio>
                        </el-radio-group>
                    </el-form-item>
                    <el-form-item label="供应商等级">
                        <el-radio-group v-model="ruleForm.supplierLevel">
                            <el-radio
                                    v-for="item in supplierLevelDict"
                                    :key="item.value"
                                    :label="item.value">{{item.label}}
                            </el-radio>
                        </el-radio-group>
                    </el-form-item>
                    <!--<el-form-item label="开户名称" prop="accountName" size="small">-->
                        <!--<el-input v-model="ruleForm.accountName" class="input"></el-input>-->
                    <!--</el-form-item>-->
                    <!--<el-form-item label="开户银行" prop="accountBank" size="small">-->
                        <!--<el-input v-model="ruleForm.accountBank" class="input"></el-input>-->
                    <!--</el-form-item>-->
                    <!--<el-form-item label="银行账号" prop="bankAccount" size="small">-->
                        <!--<el-input v-model="ruleForm.bankAccount" class="input"></el-input>-->
                    <!--</el-form-item>-->
                    <!--<el-form-item label="发票抬头" prop="invoicePayable" size="small">-->
                        <!--<el-input v-model="ruleForm.invoicePayable" class="input"></el-input>-->
                    <!--</el-form-item>-->
                    <!--<el-form-item label="税号" prop="dutyParagraph" size="small">-->
                        <!--<el-input v-model="ruleForm.dutyParagraph" class="input"></el-input>-->
                    <!--</el-form-item>-->
                    <!--<div class="blank">-->
                        <!--<div class="title"><h3><span class="title-text">|</span> 账号信息</h3></div>-->
                    <!--</div>-->
                    <!--<el-form-item label="登陆账号" prop="username" size="small">-->
                        <!--<el-input v-model="ruleForm.username" class="input"></el-input>-->
                    <!--</el-form-item>-->
                    <!--<el-form-item label="密码" prop="password" size="small">-->
                        <!--<el-input v-model="ruleForm.password" class="input"></el-input>-->
                    <!--</el-form-item>-->
                    <!--<el-form-item label="采购员" prop="purchaseEmployee" size="small">-->
                        <!--<el-input v-model="ruleForm.purchaseEmployee" class="input"></el-input>-->
                    <!--</el-form-item>-->

                    <el-form-item>
                        <el-checkbox v-model="background" @change="enabledBackground">后台启用</el-checkbox>
                        <el-checkbox v-model="openApp" @change="enabledApp">小程序启用</el-checkbox>
                    </el-form-item>

                    <el-form-item>
                        <el-button type="primary" @click="submitForm" v-show="submitBtnFlag">保存</el-button>
                        <el-button @click="resetForm">取消</el-button>
                    </el-form-item>
                </el-form>
            </template>
        </basic-container>
    </div>
</template>

<script>
    import {
        putObj,
        addObj
    } from "../../../../api/supply/supplier";
    import {fetchTree} from '@/api/admin/dept'
    import {fetchDict} from '@/util/util';
    import {fetchUid, fetchUserId} from '@/api/manage/upassport';
    import Util from '@/util/pds/utils';

    let util = new Util();
    export default {
        data() {
            return {
                ruleForm: {
                    id:'',
                    pmId: '',
                    passportId: '',
                    userId: '',
                    merchantId: '',
                    merchantName: '',
                    supplierName: '',
                    shortName: '',
                    contact: '',
                    telephone: '',
                    payPeriod: '1',
                    address:'',
                    tags:'',
                    status:'1',
                    supplierType:'1',
                    needPush:'0',
                    sort:'',
                    supplierLevel:'3',
                    area:'',
                    longitude:'',
                    latitude:''
                    // accountName:'',
                    // accountBank:'',
                    // bankAccount:'',
                    // invoicePayable:'',
                    // dutyParagraph:'',
                    // username:'',
                    // password:'',
                    // purchaseEmployee:'',
                },
                rules: {
                    supplierName: [
                        {required: true, message: '请输入名称', trigger: 'blur'},
                        {min: 1, max: 20, message: '长度在 1 到 20 个字符', trigger: 'blur'}
                    ],
                    telephone: [
                        {required: true, message: '请输入手机号', trigger: 'blur'},
                        {min: 11, max: 20, message: '长度为 11 个字符', trigger: 'blur'}
                    ],
                },
                defaultProps: {
                    label: "name",
                    value: 'id',
                },
                treeDeptData: [],
                // 绑定功能
                openApp: false,
                background: false,
                // 字典
                supplierTypeDict: [],
                useStatusDict: [],
                payPeriodDict: [],
                supplierLevelDict:[],
                // 按钮
                submitBtnFlag: true
            };
        },
        created(){
            // 字典初始化
            fetchDict('pds_supplier_type', this.supplierTypeDict);
            fetchDict('scm_use_status', this.useStatusDict);
            fetchDict('scm_pay_period', this.payPeriodDict);
            fetchDict('scm_supplier_level', this.supplierLevelDict);

            this.handleDept();

            if (this.$route.query.id) {
                this.ruleForm = this.$route.query;
                let passport = this.$route.query.passportId;
                let userId = this.$route.query.userId;
                if (passport) {
                    this.openApp = true;
                }
                if (userId) {
                    this.background = true;
                }
            }

            // 默认值
            this.ruleForm.pmId = this.getStore({name: "pmId"});
        },
        methods: {
            handleDept() {
                fetchTree().then(response => {
                    this.treeDeptData = response.data.data;
                });
            },
            submitForm() {
                this.submitBtnFlag = false;
                this.$refs['ruleForm'].validate((valid) => {
                    if (valid) {
                        if (!this.ruleForm.id) {
                            addObj(this.ruleForm).then(res => {
                                if (res.data.code === 0) {
                                    this.$message.success("添加成功")
                                } else {
                                    this.$message.error("添加失败")
                                    this.submitBtnFlag = true;
                                }
                            })
                        } else {
                            putObj(this.ruleForm).then(res => {
                                if (res.data.data === true) {
                                    this.$message.success("提交成功")
                                } else {
                                    this.$message.error("提交失败")
                                    this.submitBtnFlag = true;
                                }
                            })
                        }
                    } else {
                        this.$message.warning("必填信息未完成");
                        this.submitBtnFlag = true;
                    }
                });
            },
            resetForm() {
                this.$router.go(-1);
            },
            // 绑定uid
            enabledApp() {
                if (!this.openApp) {
                    this.ruleForm.passportId = '';
                } else if (this.ruleForm.telephone) {
                    this.ruleForm.passportId = '';
                    fetchUid({
                        'telephone': this.ruleForm.telephone
                    }).then(res => {
                        if (res.data.code === 0) {
                            this.ruleForm.passportId = res.data.data;
                        }
                    }).catch(e => {
                        this.openApp = false;
                        this.$message.warning("启用失败!找不到对应的通行证");
                    });
                } else {
                    this.openApp = false;
                    this.ruleForm.passportId = '';
                    this.$message.warning("请填写手机号码！")
                }
            },
            // 绑定 系统用户
            enabledBackground() {
                if (!this.background) {
                    this.ruleForm.userId = '';
                } else if (this.ruleForm.telephone) {
                    this.ruleForm.userId = '';
                    fetchUserId({
                        'telephone': this.ruleForm.telephone
                    }).then(res => {
                        if (res.data.code === 0) {
                            this.ruleForm.userId = res.data.data;
                        }
                    }).catch(e => {
                        this.background = false;
                        this.$message.warning("启用失败!找不到对应的用户");
                    });
                } else {
                    this.background = false;
                    this.ruleForm.userId = '';
                    this.$message.warning("请填写手机号码！")
                }
            }
        }
    }
</script>

<style lang="scss" scoped>
    .input{
        width: 50%;
    }
    .title{
        width: 100px;
        text-align: right;
    }
    .title-text{
        color: deepskyblue;
    }
    .blank{
        border-bottom:1px solid #f0f0f0;
        height: 30px;
        margin-bottom: 10px;
    }
</style>
